<template>
	<view class="page">
		<view class="input justify-content-sp">
			<input type="text" placeholder="请输入手机号或者昵称" v-model="text" />
			<uni-icons type="search" size="20" @click="search"></uni-icons>
		</view>
		<view class="body">
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					商家名称 ：
				</view>
				<view class="body_cont_right">
					鑫鑫服饰店
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					费率 ：
				</view>
				<view class="body_cont_right">
					0.4%
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					商家类型 ：
				</view>
				<view class="body_cont_right">
					由添加人员备注
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					手机号 ：
				</view>
				<view class="body_cont_right">
					12563847942
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					服务商 ：
				</view>
				<view class="body_cont_right">
					13428451256
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					邀请人 ：
				</view>
				<view class="body_cont_right">
					13428451256
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					最后登录 ：
				</view>
				<view class="body_cont_right">
					2024/04/01 21:14:04
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					登陆地点 ：
				</view>
				<view class="body_cont_right">
					陕西省西安市莲湖区XXXX
				</view>
			</view>
			<view class="body_cont_se justify-content-sp" @click="toPath(2)">
				<view class="body_cont_se_left">
					<view class="body_cont_se_left_fir">
						今日交易
					</view>
					<view class="body_cont_se_left_se">
						￥800.28
					</view>
					<view class="body_cont_se_left_thr">
						可用余额
					</view>
					<view class="body_cont_se_left_four">
						￥800.28
					</view>
				</view>
				<view class="body_cont_se_right">
					<view class="body_cont_se_right_fir">
						待结算
					</view>
					<view class="body_cont_se_right_se">
						￥800.28
					</view>
					<view class="body_cont_se_right_thr">
						总余额
					</view>
					<view class="body_cont_se_right_four">
						￥800.28
					</view>
				</view>
			</view>
			<view class="body_cont_thr justify-content-sp">
				<view class="btn_css" @click="copy">
					复制
				</view>
				<view class="btn_css" @click="change">
					更换
				</view>
			</view>
		</view>
		<view class="body" style="background-color: #686868;">
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					商家名称 ：
				</view>
				<view class="body_cont_right">
					鑫鑫服饰店
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					费率 ：
				</view>
				<view class="body_cont_right">
					0.4%
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					商家类型 ：
				</view>
				<view class="body_cont_right">
					由添加人员备注
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					手机号 ：
				</view>
				<view class="body_cont_right">
					12563847942
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					服务商 ：
				</view>
				<view class="body_cont_right">
					13428451256
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					邀请人 ：
				</view>
				<view class="body_cont_right">
					13428451256
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					最后登录 ：
				</view>
				<view class="body_cont_right">
					2024/04/01 21:14:04
				</view>
			</view>
			<view class="body_cont justify-content-start">
				<view class="body_cont_left">
					登陆地点 ：
				</view>
				<view class="body_cont_right">
					陕西省西安市莲湖区XXXX
				</view>
			</view>
			<view class="body_cont_se2 justify-content-sp">
				<view class="body_cont_se_left">
					<view class="body_cont_se_left_fir">
						今日交易
					</view>
					<view class="body_cont_se_left_se">
						￥800.28
					</view>
					<view class="body_cont_se_left_thr">
						可用余额
					</view>
					<view class="body_cont_se_left_four">
						￥800.28
					</view>
				</view>
				<view class="body_cont_se_right">
					<view class="body_cont_se_right_fir">
						今日交易
					</view>
					<view class="body_cont_se_right_se">
						￥800.28
					</view>
					<view class="body_cont_se_right_thr">
						可用余额
					</view>
					<view class="body_cont_se_right_four">
						￥800.28
					</view>
				</view>
			</view>
			<view class="body_cont_thr justify-content-sp">
				<view class="btn_css" @click="copy">
					复制
				</view>
				<view class="btn_css" @click="change">
					更换
				</view>
			</view>
			<view class="text">
				<view class="text_1">
					该商家涉嫌违规已被限制
				</view>
				<view class="text_2">
					详情联系客服热线
				</view>
				<view class="text_3">
					4008062868
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				text: ''
			}
		},
		methods: {
			// 搜索
			search() {
				console.log("搜索", this.text);
			},
			// 复制
			copy() {
				uni.setClipboardData({
					data: '要复制的文本',
					success: function() {
						console.log('复制成功');
					},
					fail: function(err) {
						console.log('复制失败');
					}
				});
			},
			// 更换
			change() {
				uni.showToast({
					title: '更换成功',
					duration: 2000
				});
			},
			toPath(e) {
				if (e == 1) {
					uni.navigateTo({
						url: '/pages/business/addBusiness'
					})
				} else if (e == 2) {
					uni.navigateTo({
						url: '/pages/daily/index'
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		height: 100%;

		.input {
			margin: 30rpx;
			padding: 20rpx 40rpx;
			border-radius: 50rpx;
			background-color: white;
		}

		.body {

			.text {
				position: absolute;
				color: white;
				margin-top: -264px;
				text-align: center;
				width: 630rpx;

				.text_1 {
					line-height: 25px;
				}

				.text_2 {
					line-height: 25px;
				}

				.text_3 {
					font-size: 30px;
				}
			}

			.body_cont {
				line-height: 25px;

				.body_cont_left {
					color: black;
				}

				.body_cont_right {}
			}

			.body_cont_se {
				background-color: #f5f5f5;
				padding: 30rpx 80rpx;
				margin: 30rpx 0;
				border-radius: 15rpx;

				.body_cont_se_left {
					text-align: center;

					.body_cont_se_left_fir {
						font-size: 14px;
					}

					.body_cont_se_left_se {
						font-weight: 600;
					}

					.body_cont_se_left_thr {
						margin-top: 10rpx;
						font-size: 14px;
					}

					.body_cont_se_left_four {
						color: #32b26c;
						font-weight: 600;
					}
				}

				.body_cont_se_right {
					text-align: center;

					.body_cont_se_right_fir {
						font-size: 14px;
					}

					.body_cont_se_right_se {
						color: red;
						font-weight: 600;
					}

					.body_cont_se_right_thr {
						margin-top: 10rpx;
						font-size: 14px;
					}

					.body_cont_se_right_four {
						font-weight: 600;
					}
				}
			}

			.body_cont_se2 {
				background-color: #626262;
				padding: 30rpx 80rpx;
				margin: 30rpx 0;
				border-radius: 15rpx;

				.body_cont_se_left {
					text-align: center;

					.body_cont_se_left_fir {
						font-size: 14px;
					}

					.body_cont_se_left_se {
						font-weight: 600;
					}

					.body_cont_se_left_thr {
						margin-top: 10rpx;
						font-size: 14px;
					}

					.body_cont_se_left_four {
						color: #164631;
						font-weight: 600;
					}
				}

				.body_cont_se_right {
					text-align: center;

					.body_cont_se_right_fir {
						font-size: 14px;
					}

					.body_cont_se_right_se {
						color: #5e0e0a;
						font-weight: 600;
					}

					.body_cont_se_right_thr {
						margin-top: 10rpx;
						font-size: 14px;
					}

					.body_cont_se_right_four {
						font-weight: 600;
					}
				}
			}

			.body_cont_thr {
				padding: 0 100rpx;
			}
		}
	}
</style>